import React from 'react';
import PropTypes from 'prop-types';
import SidebarGroup from '../components/SidebarGroup';

class CategoriesComponent extends React.Component {
  constructor(props) {
    super(props);
  }

  render() {
    const { categories } = this.props;
    const mappedItems = categories && categories.map(cat => ({
      itemId: cat.categoryId,
      itemName: cat.categoryName,
      itemLink: `works/category/${cat.categoryId}`,
    }));
    return (
      <SidebarGroup groupName="发现" items={mappedItems} />
    );
  }
}

CategoriesComponent.propTypes = {
  categories: PropTypes.arrayOf(PropTypes.shape({
    categoryId: PropTypes.number,
    categoryName: PropTypes.string,
  })),
};

export default CategoriesComponent;
